<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p id="status"></p>
    <ul>

    </ul>
    <script>
        var obj = {
            id: 11,
            log: "233"
        }

        var arrOjb = [{
            title: "title",
            content: "content"
        }, {
            title: "title1",
            content: "content2"
        }]
        var db = openDatabase('demoDB', '1.0', 'Test DB', 2 * 1024 * 1024, function (info) {
            console.log(info, '<--info');
        });

        db.transaction(function (tx) {
            console.log(1);
            console.log(tx, '<--tx');
            // tx.executeSql('CREATE TABLE IF NOT EXISTS LOGS (id unique, log)');
            tx.executeSql('CREATE TABLE IF NOT EXISTS demotable(id integer primary key autoincrement, log)');
            console.log(2);
            tx.executeSql('INSERT INTO demotable ( log) VALUES ("jlkj=ljasdfa\.asd#fasdf")');

            // tx.executeSql('INSERT INTO demotable (id, log) VALUES (10, "jlkj=ljasdfa\.asd#fasdf")');
            // tx.executeSql('INSERT INTO LOGS (id,log) VALUES (?, ?)', [obj.id, obj.log]);
            // tx.executeSql('INSERT INTO LOGS (log) VALUES (?)', [obj.log]);

            console.log(3);
        })

        
        db.transaction(function (tx) {
            
            tx.executeSql('SELECT * FROM demotable', [], function (tx, results) {
                var html = '';
                var len = results.rows.length, i;
                msg = "<p>查询记录条数: " + len + "</p>";
                document.querySelector('#status').innerHTML += msg;

                for (i = 0; i < len; i++) {
                    // alert(results.rows.item(i).log);
                    console.log(results.rows.item(i).log,'<---看看记录是什么样的结构');
                    html += '<li>'+results.rows.item(i).log+'</li>';
                    
                }
                document.querySelector('ul').innerHTML = html;

                

            }, null);
        });

        db.transaction(function (tx) {
            // tx.executeSql('DELETE FROM demotable  WHERE id=?',[22]);
            // tx.executeSql('DELETE FROM LOGS WHERE id=?', [id]);

            tx.executeSql('UPDATE demotable SET log="www\.w3cschool\.cc" WHERE id=23');
        });
    </script>
</body>

</html>